<template>
	<view>
		<u-navbar leftIconColor="#fff" :left-text="text" :autoBack="true" title=" " titleStyle="color:#fff"
			:placeholder="false" bgColor="transparent">
		</u-navbar>
		<image class="img" mode="widthFix" :src="info.img"></image>
		<view class="info_box">
			<view class="head">
				<view class="name text">{{info.name}}</view>
				<view class="price"><span class="money">￥</span>{{info.price}}/{{info.dw}}</view>
			</view>
			<view class="hui_tc"></view>
			<view class="head">
				<view class="text jj">租赁简介</view>
				<image class="img" mode="widthFix" :src="info.img"></image>
				<view class="content_box">
					<rich-text :nodes="info.content" class="content"></rich-text>
				</view>
			</view>
		</view>
		<view class="bottom_box b_flex_c_s">
			<view class="kf_box" @click="$project.toPhone()">
				<image class="kflx" mode="widthFix" src="@/static/img/kflx.png"></image>
				<view>客服</view>
			</view>
			<view class="zl" @click="$project.toPath('/pages/lease/order')">立即租赁</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				info:{
					img: require('@/static/img/test/text.png'),
					name: '陪护床被子租赁、金日组,今日住',
					price: 16.8,
					dw: '套',
					content:'详情'
				}
			}
			
		}
	}
</script>

<style scoped lang="scss">
	.img{
		width: 100%;
	}
	.info_box{
		position: relative;
		top:-50rpx;
		border-radius: 50rpx 50rpx 0 0;
		background-color: #fff;
	}
	.head{
		box-sizing: border-box;
		padding:30rpx;
	}
	.text{
		color: #252B50;
	}
	.name {
		font-weight: bold;
		margin-bottom: 10rpx;
		font-size: 36rpx;
	}
	.price {
		color: #FF0100;
		font-weight: bold;
		font-size: 30rpx;
	}
	.money{
		font-size: 25rpx;
	}
	.hui_tc{
		width: 100%;
		height: 16rpx;
		background: #F5F5F5;
	}
	.jj{
		font-weight: bold;
		margin-bottom: 10rpx;
	}
	.content_box{
		box-sizing: border-box;
		padding: 20rpx 0;
	}
	.bottom_box{
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		box-sizing: border-box;
		padding:  20rpx 30rpx;
		background-color: #fff;
	}
	.kf_box{
		text-align: center;
		margin-left: 80rpx;
		font-size: 22rpx;
		font-weight: 500;
		color: #252B50;
	}
	.kflx{
		width: 42rpx;
	}
	.zl{
		width: 65%;
		height: 68rpx;
		line-height: 68rpx;
		text-align: center;
		background: #3C7CFF;
		box-shadow: 0px 3px 3px 0px rgba(99,119,245,0.3);
		border-radius: 8rpx;
		color: #fff;
	}
</style>